<template>
    <div class="wiv-dialog">
        <div class="wiv-dialog-body">
            <el-form ref="formDialog"
                     :model="oDetailForm"
                     :rules="oRules"
                     label-width="7em"
                     :disabled="bIsView">
                <el-row>
                    <el-col :span="12">
                        <el-form-item prop="name"
                                      label="名称:">
                            <el-input v-model="oDetailForm.name"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="描述:">
                            <el-input v-model="oDetailForm.des"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="站点类型:">
                            <el-select v-model="oDetailForm.zdlx">
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="入口站点:">
                            <el-select v-model="oDetailForm.rkzd">
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="出口站点:">
                            <el-select v-model="oDetailForm.ckzd">
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
        </div>
        <div class="wiv-dialog-foot"
             v-if="!bIsView">
            <el-button type="primary"
                       @click="fDialogBtnClick('save')">保存</el-button>
            <!--<el-button @click="fDialogBtnClick('test')">test</el-button>-->
        </div>
    </div>
</template>

<script>
    import { URLS_DEMO } from '@/urls.js';

    export default {
        props: {
            detail: {//表格选中行，未传则为新建
                type: Object
            },
            isView: {//判断是否是查看（查看时，表单不可修改）
                type: Boolean,
                default: false
            },
        },
        data() {
            const fGetValidateRule = this.$WIV.fGetValidateRule;//获取验证工厂函数
            return {
                sDetailId: this.detailId,//表格选中行id
                oDetailForm: {},//弹框表单数据
                bIsView: this.isView,//判断是否是查看
                oRules: {//验证规则
                    //http://7333.wisoft.com.cn/in_wiv/doc/index.html#/validate
                    name: [
                        fGetValidateRule('required')
                    ]
                },
            }
        },
        mounted() {
            this.fRequestDetail();
        },
        methods: {
            fRequestDetail() {//根据传入的选中行，请求详情数据
                if (this.detail) {
                    this.$WIV.fRequest({
                        url: URLS_DEMO.d_detail,
                        data: {
                            id: this.detail.id,
                        }
                    }).then(({ data: oData }) => {
                        this.oDetailForm = oData;
                    });
                }
            },
            fDialogBtnClick(sType) {//弹框按钮点击事件
                switch (sType) {
                    case 'save'://保存
                        this.$refs.formDialog.validate(bSuccess => {//表单验证
                            if (bSuccess) {//验证成功
                                this.$WIV.fRequest({
                                    url: URLS_DEMO.d_save,
                                    data: this.oDetailForm
                                }, {
                                    //argToJson: true,//修改请求参数数据类型
                                    //application/json => argToJson: true
                                    //application/x-www-form-urlencoded => 不需要设置 argToJson
                                }).then(() => {
                                    this.$WIV.fShowMsg('保存成功!', {
                                        type: 'success'
                                    });
                                    this.$emit('data-change');//调用父组件列表刷新方法
                                    this.$emit('update:visible', false);//抛出事件关闭当前弹框
                                });
                            }
                        });
                        break;
                    case 'test'://其他按钮
                        //...
                        break;
                }
            }
        }
    }
</script>

<style>
</style>